<%--
  Created by IntelliJ IDEA.
  User: houxianghua
  Date: 2015/10/12
  Time: 16:00
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/jsp/component/common.jsp" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="">
  <meta name="author" content="">
  <title>随访主页面</title>
  <%@include file="/WEB-INF/jsp/component/commonHead.jsp" %>
  <%@include file="/WEB-INF/jsp/component/commonBottom.jsp" %>
  <%--<script type="text/javascript" src="${assets}/PIE_IE678.js"></script>--%>
  <link rel="stylesheet" href="${assets}/followUp/css/base.css" type="text/css">
  <link rel="stylesheet" href="${assets}/followUp/hypertension/css/highblood.css" type="text/css">
  <link href="${css}/bootstrap-datetimepicker.min.css" rel="stylesheet"/>

  <script type="text/javascript" src="${assets}/followUp/js/base.js"></script>
  <script type="text/javascript" src="${assets}/followUp/hypertension/js/highblood.js"></script>
  <script type="text/javascript" src="${assets}/followUp/hypertension/js/dell.js" charset="UTF-8"></script>

  <script src="${js}/jquery.twbsPagination.min.js"></script>
  <script src="${js}/bootstrap-dateTime/bootstrap-datetimepicker.js"></script>
  <script type="text/javascript" src="${js}/bootstrap-dateTime/locales/bootstrap-datetimepicker.zh-CN.js" ></script>
</head>
<body>
<div class="visitData">
  <!-- 个人信息 -->
  <div class="information">
    <p class="personalTitle">个人信息</p>
    <div class="detail-top">
      <label>责任医师:</label>
      <div class="doctor">
        <input type="text" value="${followUp.responsibleDoctor}">
      </div>
      <div class="form-group">
        <label>随访时间:</label>
        <div id="Time" class="input-group date form_date col-md-5" style="width: 146px"  data-date-format="yyyy-mm-dd">
          <input class="form-control" size="12" type="text" value="<fmt:formatDate value="${followUp.startTime}" pattern="yyyy-MM-dd"/>" readonly style="text-indent:0">
                  	<span class="input-group-addon">
                  		<span class="glyphicon glyphicon-calendar aria-hidden='true'"></span>
          </span>
        </div>
      </div>
    </div>
    <div class="detail-bottom drop-down">
      <div class="visit-type">
        <label>随访方式:</label>
        <div class="select">
          <div class="base" id="VisitType" data-value="${followUp.followUpType}"></div>
          <span></span>
          <ul class="test">
            <c:forEach items="${followupTypeList}" var="follType">
              <li data-option-value="${follType.code}">${follType.name}</li>
            </c:forEach>
          </ul>
        </div>
      </div>
      <div class="HighBloodType">
        <label class="blank">高血压类型:</label>
        <div class="select">
          <div class="base" id="BloodType" data-value="${hypertension.hypertensionType}"></div>
          <span></span>
          <ul class="test">
            <c:forEach items="${hypTypeList}" var="hypType">
              <li data-option-value="${hypType.code}">${hypType.name}</li>
            </c:forEach>
          </ul>
        </div>
      </div>
    </div>
  </div>
  <!-- 症状 -->
  <div class="symptom">
    <div class="symptomTitle">
      症状
    </div>
    <div class="symptomDetail">
      <div class="form-group">
        <div class="col-sm-12">
          <label class="checkbox-inline">
            <input type="checkbox" <c:if test='${hypertension.hypertensionSymptoms==null || hypertension.hypertensionSymptoms==""}'>checked</c:if> >无症状
          </label>
        </div>
        <c:forEach items="${symptomList}" var="symptom" varStatus="status">
          <div class="col-sm-2">
            <label class="checkbox-inline">
              <input type="checkbox" name="hypertension.hypertensionSymptoms" value="${symptom.code}">${symptom.name}
            </label>
          </div>
          <c:if test='${ (status.index + 1)%6 == 0}'>
            <br style="clear:both;" />
          </c:if>
        </c:forEach>
      </div>
    </div>
  </div>
  <!-- 体征 -->
  <div class="signs">
    <div class="signsTitle">
      体征
    </div>
    <div class="signsDetail">
      <div class="signs_left">
        <div class="BloodPressure">
          <label>血压(mmHg):</label>
          <input type="text" value="${hypertension.systolicPressure}">&nbsp;&nbsp;/&nbsp;&nbsp;<input type="text" value="${hypertension.diastolicPressure}">
        </div>
        <div class="weight">
          <label>体重(kg):</label>
          <input type="text" value="${hypertension.weight}">
        </div>
        <div class="bmi">
          <label>体质指数:</label>
          <input type="text" value="${hypertension.bmi}">
        </div>
      </div>
      <div class="signs_right">
        <div class="Heartrate">
          <label>心率(次/分):</label>
          <input type="text" value="${hypertension.heartRate}">
        </div>
        <div class="height">
          <label>身高:</label>
          <input type="text" value="${hypertension.height}">
        </div>
      </div>
    </div>
  </div>
  <!-- 生活指导方式 -->
  <div class="guideWay">
    <div class="guideWayTitle">
      生活指导方式
    </div>
    <div class="guideWayDetail">
      <div class="guideWayDetail_t">
        <div class="smoke">
          <label>日吸烟量(支):</label>
          <input type="text" value="${hypertension.smokingQuantity}">
        </div>
        <div class="drink">
          <label>日饮酒量(两):</label>
          <input type="text" value="${hypertension.drinkQuantity}">
        </div>
      </div>
      <div class="guideWayDetail_c">
        <div class="sport">
          <label>运动量:</label>
          <input type="text" value="${hypertension.exerciseQuantity}">
          <span class="week">&nbsp;次、周&nbsp;</span>
          <input type="text" value="${hypertension.exerciseQuantityItem}">
          <span>&nbsp;&nbsp;分/次</span>
        </div>
      </div>
      <div class="guideWayDetail_bc drop-down">
        <div class="saltSituation">
          <label>摄盐情况<br />(克/天):</label>
          <input type="text" value="${hypertension.saltIntake}">
        </div>
      </div>
      <div class="guideWayDetail_b drop-down">
        <div class="adjustment">
          <label>心理调整:</label>
          <div class="select">
            <div class="base" id="phychologist" data-value="${hypertension.psychologicalRecovery}"></div>
            <span></span>
            <ul class="test">
              <c:forEach items="${mentalityList}" var="mentality">
                <li data-option-value="${mentality.code}">${mentality.name}</li>
              </c:forEach>
            </ul>
          </div>
        </div>
        <div class="behavoir">
          <label>嘱医行为:</label>
          <div class="select">
            <div class="base" id="doctorBehavior" data-value="${hypertension.haveMedicalBehavior}"></div>
            <span></span>
            <ul class="test">
              <c:forEach items="${haveMedicalBehaviorList}" var="haveMedicalBehavior">
                <li data-option-value="${haveMedicalBehavior.code}">${haveMedicalBehavior.name}</li>
              </c:forEach>
            </ul>
          </div>
        </div>
      </div>

    </div>
  </div>
  <!-- 辅助检查 -->
  <div class="AuxiliaryCheck">
    <div class="checkHead">
      <div class="CheckTitle">
        辅助检查
      </div>
      <div class="Add">
        <%--<input type="button" value="新增">--%>
      </div>
    </div>
    <table class="Checktable">
      <thead>
      <tr>
        <th>辅助检查项目</th>
        <th>辅助检查结果</th>
        <th>检查人</th>
        <th>检查日期</th>
      </tr>
      </thead>
      <tbody>
      <c:forEach items="${hypertension.accessoryexam}" var="accessoryexam">
        <tr>
          <td>${accessoryexam.item}</td>
          <td>${accessoryexam.result}</td>
          <td>${accessoryexam.checkPerson}</td>
          <td>${accessoryexam.doTime.year}-${accessoryexam.doTime.monthOfYear}-${accessoryexam.doTime.dayOfMonth}</td>
        </tr>
      </c:forEach>
      </tbody>
    </table>
  </div>

  <!-- 服药依从性 -->
  <div class="takeMedicine">
    <div class="takeMedicineTitle">
      服药依从性
    </div>
    <div class="Medicine drop-down">
      <div class="Adherence">
        <label>服药依从性:</label>
        <div class="select">
          <div class="base" id="MedicationAdhere" data-value="${hypertension.medicationCompliance}"></div>
          <span></span>
          <ul class="test">
            <c:forEach items="${medicationComplianceList}" var="medicationCompliance">
              <li data-option-value="${medicationCompliance.code}">${medicationCompliance.name}</li>
            </c:forEach>
          </ul>
        </div>
      </div>
    </div>
  </div>
  <!-- 药物不良反应 -->
  <div class="AdverseReactions">
    <div class="ReactionsTitle">
      不良反应
    </div>
    <div class="survey">
      <input type="radio" id="haveDrugAdverseReaction" name="drugAdverseReactionRadio" <c:if test='${hypertension.drugAdverseReaction!=""}'>checked</c:if> ><label for="haveDrugAdverseReaction">有</label>
      <input type="radio" id="noDrugAdverseReaction" name="drugAdverseReactionRadio" <c:if test='${hypertension.drugAdverseReaction==""}'>checked</c:if> ><label for="noDrugAdverseReaction">无</label>
      <input type="text" id="drugAdverseReaction" name="hypertension.drugAdverseReaction" <c:if test='${hypertension.drugAdverseReaction==""}'>readonly</c:if> class="oTxt" value="${hypertension.drugAdverseReaction}">
    </div>
  </div>
  <!-- 此次随访分类 -->
  <div class="classification">
    <div class="classificationTitle">
      此次随访分类:
    </div>
    <div class="visitClassification drop-down">
      <label>此次随访分类:</label>
      <div class="select">
        <div class="base" id="VisitClass" data-value="${hypertension.thisClassification}"></div>
        <span></span>
        <ul class="test">
          <c:forEach items="${thisClassificationList}" var="thisClassification">
            <li data-option-value="${thisClassification.code}">${thisClassification.name}</li>
          </c:forEach>
        </ul>
      </div>
    </div>
  </div>
  <!-- 用药情况 -->
  <div class="AuxiliaryCheck">
    <div class="checkHead">
      <div class="CheckTitle">
        用药情况
      </div>
      <div class="Add">
        <%--<input type="button" value="新增">--%>
      </div>
    </div>
    <table class="Checktable">
      <thead>
      <tr>
        <th>药物名称</th>
        <th>药物类型</th>
        <th>用量</th>
        <th>药物单位</th>
        <th>用法</th>
        <th>使用总剂量</th>
        <th>给药方式</th>
      </tr>
      </thead>
      <tbody>
      <c:forEach items="${hypertension.druguse}" var="druguse">
        <tr>
          <td>${druguse.drugName}</td>
          <td>${druguse.drugType}</td>
          <td>${druguse.dosage}</td>
          <td>${druguse.drugUnit}</td>
          <td>${druguse.instruction}</td>
          <td>${druguse.totalDose}</td>
          <td>${druguse.drugDeliveryMethod}</td>
        </tr>
      </c:forEach>
      </tbody>
    </table>
  </div>

  <!-- 治疗建议 -->
  <div class="suggestion">
    <div class="suggestTitle">
      治疗建议:
    </div>
    <div class="TreatmentSuggest">
      <label>治疗建议:</label>
      <input type="text" class="treatment" value="${hypertension.treatmentRecommendations}">
    </div>
  </div>
  <!-- 转诊 -->
  <div class="referral">
    <div class="referralTitle">
      转诊:
    </div>
    <div class="referralDetail">
      <span class="title">转诊:</span>
      <div class="referralForm">
        <input type="radio" id="isReferralNo" name ="hypertension.isReferral" value="0" <c:if test='${hypertension.isReferral==0}'>checked</c:if> >
        <label for="isReferralNo">无</label>
        <input type="radio" id="isReferralHave" name ="hypertension.isReferral" value="1" <c:if test='${hypertension.isReferral==1}'>checked</c:if> >
        <label for="isReferralHave">有</label>
      </div>
      <div class="referralText">
        <label>原因:</label>
        <input type="text" id="referralReasons" name="hypertension.referralReasons" value="${hypertension.referralReasons}">
        <label>机构及科室:</label>
        <input type="text" id="referralDep" name="hypertension.referralDep" value="${hypertension.referralDep}">
      </div>
    </div>
  </div>
  <!-- 转诊回访 -->
  <div class="returnVisit">
    <div class="returnVisitTitle">
      转诊回访:
    </div>
    <div class="returnVisitDetail">
      <div class="form-group">
        <label id="DATE">日期:</label>
        <div id="VisitTime" class="input-group date form_date col-md-5" style="width: 146px"  data-date-format="yyyy-mm-dd">
          <input class="form-control" size="12" type="text" value="${hypertension.referralVisitTime.year}-${hypertension.referralVisitTime.monthOfYear}-${hypertension.referralVisitTime.dayOfMonth}" readonly style="text-indent:0">
                  	<span class="input-group-addon">
                  		<span class="glyphicon glyphicon-calendar aria-hidden='true'"></span>
          </span>
        </div>
      </div>
      <div class="diseaseCheckbox">
        <div class="organDamage">
          <p class="organTitle">靶器官损害:</p>
          <div class="DamageDetail">
            <c:forEach items="${targetOrganDamageList}" var="targetOrganDamage" varStatus="status">
              <div class="commonform">
                <label><input type="checkbox" name="hypertension.targetOrganDamage" value="${targetOrganDamage.code}">${targetOrganDamage.name}</label>
              </div>
            </c:forEach>
            <c:if test='${ (status.index + 1)%6 == 0}'>
              <br style="clear:both;" />
            </c:if>
          </div>
        </div>
        <div class="complications">
          <p class="complicationsTitle">合并症:</p>
          <div class="complicationsDetail">
            <c:forEach items="${complicationList}" var="complication" varStatus="status">
              <div class="commonform">
                <label><input type="checkbox" name="hypertension.complication" value="${complication.code}">${complication.name}</label>
              </div>
            </c:forEach>
            <c:if test='${ (status.index + 1)%6 == 0}'>
              <br style="clear:both;" />
            </c:if>
          </div>
        </div>
      </div>
      <div class="OtherIllnesses">
        <label class="otherlabel">其他疾病:</label>
        <input type="text" value="${hypertension.otherDiseases}">
      </div>
    </div>
  </div>

</div>

<script type="text/javascript">
  $(document).ready(function(){
    $('.date').datetimepicker({
      language:  'zh-CN',
      weekStart:  0,
      todayBtn: true,
      autoclose:  1,
      todayHighlight: 1,
      startView: 2,
      minView: 2,
      forceParse: 0,
      format: "yyyy-mm-dd"
    });

    //设置症状选中值
    var hsArr = "${hypertension.hypertensionSymptoms}".split("|");
    for(var i=0; i<hsArr.length; i++){
      if(hsArr[i]!=""){
        $("input[name='hypertension.hypertensionSymptoms']").each(function(){
          if(this.value==hsArr[i]){
            $(this).attr("checked","checked");
          }
        });
      }
    }

    //设置靶器官损害选中值
    var todArr = "${hypertension.targetOrganDamage}".split("|");
    for(var i=0; i<todArr.length; i++){
      if(todArr[i]!=""){
        $("input[name='hypertension.targetOrganDamage']").each(function(){
          if(this.value==todArr[i]){
            $(this).attr("checked","checked");
          }
        });
      }
    }

    //设置合并症选中值
    var complicationArr = "${hypertension.complication}".split("|");
    for(var i=0; i<complicationArr.length; i++){
      if(complicationArr[i]!=""){
        $("input[name='hypertension.complication']").each(function(){
          if(this.value==complicationArr[i]){
            $(this).attr("checked","checked");
          }
        });
      }
    }

    //不良反应
    $("#noDrugAdverseReaction").click(function(){
      $("#drugAdverseReaction").attr("readonly","readonly");
      $("#drugAdverseReaction").val("");
    });
    $("#haveDrugAdverseReaction").click(function(){
      $("#drugAdverseReaction").removeAttr("readonly");
    });

    //转诊
    $("#isReferralNo").click(function(){
      $("#referralReasons").attr("readonly","readonly");
      $("#referralReasons").val("");
      $("#referralDep").attr("readonly","readonly");
      $("#referralDep").val("");
    });
    $("#isReferralHave").click(function(){
      $("#referralReasons").removeAttr("readonly");
      $("#referralDep").removeAttr("readonly");
    });


  });

</script>


</body>
</html>
